<template>
  <div class="page-detail">
    <el-row>
      <el-col :span="24">
        <crumbs
          :keyword="keyword"
          :type="type"/>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="24">
        <summa :meta="product"/>
      </el-col>
    </el-row>
    <el-row class="m-title">
      <el-col :span="24">
        <h3>商家团购及优惠</h3>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="24">
        <list
          v-if="login"
          :list="list"/>
        <div
          v-else
          class="deal-need-login">
          <img
            src="//p0.meituan.net/codeman/56a7d5abcb5ce3d90fc91195e5b5856911194.png"
            alt="登录查看">
          <span>请登录后查看详细团购优惠</span>
          <el-button
            type="primary"
            round>
            <a href="/login">立即登录</a>
          </el-button>
        </div>
      </el-col>
    </el-row>
  </div>
</template>
 
<script lang='ts'>
// 登录了 抢购才创建购物车
import { Component, Vue } from 'vue-property-decorator'
import Crumbs from '@/components/detail/crumbs.vue';
import Summa from '@/components/detail/summary.vue'
import List from '@/components/detail/list.vue'
@Component({
  // 线上数据挂了 本地
  async asyncData({store, query, params, $axios}){
    console.log(store.state.geo.city);
    // const {status, data: {summary, detailInfo, photos, dealList}} = await $axios.get(`/search/product/${params.id}`, {
    //   keyword: query.keyword,
    //   city: store.state.geo.city
    // })
    
    let {keyword,type} = query;
    const {status, data: {product,more:list,login}} = await $axios.get(`/search/product/${params.id}`, {
      keyword: query.keyword,
      city: store.state.geo.city
    })
    if(status===200){
      return {
        keyword,
        product,
        type,
        list,
        login
      }
    }else{
      return {
        keyword,
        product:{},
        type,
        list:[],
        login:false
      }
    }
  },
  components: {
    Crumbs,
    Summa,
    List
  }
})
export default class extends Vue {
 
}
</script>
<style lang='scss'>
 @import "@/assets/css/detail/index.scss";
</style>